<template>
	<view class="thing">
    <u-tabs :list="list" :current="current" @change="tabsChange" />
    <view class="thing-swipe-content">
      <warehouse v-if="current === 0"/>
      <feed  v-if="current === 1"/>
      <device  v-if="current === 2"/>
    </view>
	</view>
</template>

<script>
import warehouse from "./warehouse.vue";
import feed from "./feed.vue";
import device from "./device.vue";
	export default {
    components: {
      warehouse,
      feed,
      device
    },
		data() {
			return {
        list: [{
          name: '仓库'
        }, {
          name: '饲料'
        }, {
          name: '设备'
        }],
        current: 0, // tabs组件的current值，表示当前活动的tab选项
			}
		},
		methods: {
      // tabs通知swiper切换
      tabsChange(index) {
        this.current = index;
      },
		}
	}
</script>

<style lang="scss">
.thing {
  height: 100%;
  overflow: auto;
  background-color: #F8F9FD;
  display: flex;
  flex-direction: column;
  .thing-swipe-content {
    flex-grow: 1;
  }
}
</style>
